{% extends base %}

{% block head %}

<style type="text/css">

.gallery-item {
    float: left;
    width: 25%;
    height: 180px;
    text-align: center;
    overflow: hidden;
    border:1px solid #ccc;
}

@media screen and (max-width: 700px) {
    /** mobile **/
    .gallery-item {
        width: 50%;
    }
}

.gallery-item>div {
    width:100%;
    height:150px;
    line-height:150px;
}

.gallery-item img {
    max-width:100%;
    max-height:150px;
    display:inline-block;
    vertical-align:middle;
}

.gallery-item a {
    display: block;
}

.list-item {
    float: left;
    width: 100%;
    padding: 3px;
}
.list-item:hover {
    background-color: #eee;
    cursor: pointer;
}

.menu {
    display: block;
}
</style>

    {% set search_action = '/fs_find' %}
    {% set search_placeholder = '搜索文件' %}
    
{% end %}

{% block search_form %}
    <input type="text" name="mode" class="hide" value="grid"/>
    <input type="text" name="path" class="hide" value="{{?path}}"/>
{% end %}

{% block body %}

{% init parent_path = None %}

<div class="card">

    {% include mod_fs_path.html %}
    {% include fs/fs_options.html %}

<div class="file-list">
    
    {% if parent_path %}
    <div class="gallery-item">
        <div>
            <img src="/static/image/folder2.png">
        </div>
        <a href="/fs/{{parent_path}}?mode=grid">上级目录</a>
    </div>
    {% end %}

{% for item in filelist %}
    {# 隐藏文件 #}
    {% if item.name == "" %}
        {% continue %}
    {% end %}
    
    {% if xconfig.FS_HIDE_FILES and (item.name[0] == "." or item.name.endswith((".pyc", ".class"))) %}
        {% continue %}
    {% end %}

    {% if not item.name.startswith("._") %}
        <div class="gallery-item">
            <div>
                {% if item.type == "dir" %}
                    <img src="/static/image/folder2.png">
                {% elif xutils.is_img_file(item.path) %}
                    <img class="x-photo" src="/fs/{{item.path}}">
                {% else %}
                    <img src="/static/image/file.png">
                {% end %}
            </div>
            <a href="/fs/{{item.path}}?mode=grid">{{item.name}}</a>
        </div>
    {% end %}
{% end %}
</div>

</div>

{% end %}

{% block aside %}
    {% include fs/mod_aside.html %}
{% end %}